<template>
  <view >
  <DaDropdownVue2 
      :dropdownMenu="dropdownMenuList"
      @confirm="handleConfirm"
      @close="handleClose"
      @open="handleOpen"
      @param="selectParam"
      :fixedTop="true"
      >
    </DaDropdownVue2>
   <z-paging ref="paging" v-model="lists" @query="queryList" :fixed="false" height="85vh" :refresher-enabled="false" >
 
      			<uni-list>
  <uni-list-item   v-for="(item, index) in lists" :key="index" :title="item.studentname" showArrow clickable 
      :thumb="imageurl(item.avater,index)"  :avatar-circle="true" @click="navto(item)"
      thumb-size="lg" />
 
</uni-list>

 
      </z-paging>
   
    
    </view>
</template>

<script>

import DaDropdownVue2 from '../../../components/da-dropdown-vue2/index.vue'

export default {
  components: { DaDropdownVue2 },
  data() {
    return {
      searchTitle:'',
      searchOrderBy : '1',
      searchClaId : '',
      
      lists: [],
      options: '',
      message: [
      // 唯一性。存在 search 就会显示搜索框
        {
          title: '搜索',
          type: 'search',
          prop: 'god0',
        // value: '哈哈哈', // 默认内容 哈哈哈
        }],
      dropdownMenuList: [
      // 唯一性。存在 search 就会显示搜索框
        {
          title: '搜索',
          type: 'search',
          prop: 'god0',
        // value: '哈哈哈', // 默认内容 哈哈哈
        },
        {
          title: '最近报名优先',
          type: 'cell',
          prop: 'god1',
          showAll: true,
          showIcon: true,
          // value: '2', // 默认内容2
          options: [
            { label: '最近报名优先', value: '1' },
             { label: '学员姓名A-Z', value: '2'},
          ],
          value: "1",
        },

        {
          title: '级联',
          type: 'picker',
          prop: 'god5',
          showAll: true,
          showIcon: true,
          field: {
            label: 'label',
            value: 'value',
            children: 'children',
          },
          }
      

      ],
    }
  },

 async onLoad() {
   await this.$u.api.filterList().then(response => {
       this.options = response.data
      
    })
   await this.$set(this.dropdownMenuList, 2,         {
       title: '筛选',
       type: 'picker',
       prop: 'god5',
       showAll: true,
       showIcon: true,
       value : '',
       field: {
         label: 'label',
         value: 'value',
         children: 'children',
       },
          // value: '2', // 默认内容2
          options: this.options ,
        });


  },
  mounted() {
  },
  methods: {
    selectParam(searchTitle,searchOrderBy,searchClaId){
      this.searchTitle =searchTitle
      this.searchOrderBy =searchOrderBy
      this.searchClaId = searchClaId
      this.$refs.paging.reload()
    },
    navto(item){
      uni.navigateTo({
        url: '/pages/sys/student/student_detail?data='+JSON.stringify(item)
      })
      
    },
    
    imageurl(item,index){
      if(item == ""){
        return require('@/static/common/img/people' + index % 8 + '.png')
      }
      return this.vuex_config.imgUrl+'/dev-api'+item
    },
    queryList(pageNo, pageSize){
                  const params = {
                      num: pageSize,
                      page: pageNo,
                      searchTitle:this.searchTitle,
                      searchOrderBy:this.searchOrderBy ,
                      searchClaId:  this.searchClaId 
                  }
                  this.$u.api.studentListapp(
                    params
                  ).then(response => {
                    if (response.code == 200) {
                        this.$refs.paging.complete(response.data);
                    } else {
                      uni.showToast({
                        title: '服务器出错',
                        icon: 'error'
                      })
                  
                  
                    }
                  })
                  // 此处请求仅为演示，请替换为自己项目中的请求
              },
    

    handleConfirm(v, selectedValue) {
    },
    handleClose(v, callbackMenuList) {
    },
    handleOpen(v) {
    },
  },
}
</script>

<style lang="scss">
.dadropdown-exp {
  padding: 200px 0;
  text-align: center;
}
.marigntop{
  top: 0;
  margin-top: 500rpx;
}

</style>
